import {createRouter, createWebHistory} from 'vue-router'

const routes = [
    {
        path: '/',
        component: () => import('../view/Layout.vue'),
        children: [
            {
                path: '',
                name: 'Home',
                component: () => import('../view/Home.vue'),
                meta: {title: '首頁', keepAlive: true}
            },
            {
                path: 'classification',
                name: 'Classification',
                component: () => import('../view/Classification.vue'),
                meta: {title: '分類'}
            },
            {
                path: 'search',
                name: 'Search',
                component: () => import('../view/Search.vue'),
                meta: {title: '搜索'}
            },
            {
                path: 'cart',
                name: 'Cart',
                component: () => import('../view/Cart.vue'),
                meta: {title: '購物車'}
            },
            {
                path: 'detail/:id',
                name: 'Detail',
                component: () => import('../view/Detail.vue'),
                meta: {title: '商品詳情'}
            },
            {
                path: 'order',
                name: 'Order',
                component: () => import('../view/Order.vue'),
                meta: {title: '確認訂單'}
            },
            {
                path: 'order-success',
                name: 'OrderSuccess',
                component: () => import('../view/OrderSuccess.vue'),
                meta: {title: '訂單成功'}
            },
            {
                path: 'message',
                name: 'Message',
                component: () => import('../view/Message.vue'),
                meta: {title: '信息'}
            },
            {
                path: 'dd',
                name: 'Dd',
                component: () => import('../view/ClientOrder.vue'),
                meta: {title: '訂單'}
            }
        ]
    }
]

const router = createRouter({
    history: createWebHistory(),
    routes
})


// 全局前置守卫
router.beforeEach(async (to, _from, next) => {
    const title = to.meta?.title as string
    if (title) {
        //动态导入,等待Layout.vue加载完在使用
        const {useLogoTextStore} = await import('../stores/logoText.ts')
        const logoTextStore = useLogoTextStore()
        const logoText = logoTextStore.getItemById(1)
        document.title = (logoText ? logoText.text : '') + ' - ' + title
    }
    next()
})


export default router
